function DrawCharts(ec, theme) {

	chartEC = ec;

	$.ajax({
		url : './chart/showChart',
		type : 'post',
		data : {
			fieldStr : "",
			nodeStr : "",
			level : "0",
			chartType : "pie",
			chartStyle : "pie",
			normalType : 0
		},
		dataType : 'json'
	}).done(function(data) {

		$.each(data, function(i, item) {

			FunDrawPie(chartEC, item.divID, theme, item.echartData);
		});
	});

	$.ajax({
		url : './chart/showChart',
		type : 'post',
		data : {
			fieldStr : "",
			nodeStr : "",
			level : "0",
			chartType : "bar",
			chartStyle : "bar",
			normalType : 0
		},
		dataType : 'json'
	}).done(function(data) {

		$.each(data, function(i, item) {

			FunDrawBar(chartEC, item.divID, theme, item.echartData);
		});
	});

	// FunDrawPie(chartEC, 'chartContainer1', theme);
	// FunDrawBar(chartEC, 'chartContainer2', theme);

	showSpinner('#lineDiv');
	showSpinner('#chartContainer1');
	showSpinner('#chartContainer2');
	
	$.ajax({
		url : './chart/showChart',
		type : 'post',
		data : {
			fieldStr : "",
			nodeStr : "",
			level : "0",
			chartType : "doubleLine",
			chartStyle : "doubleLine",
			normalType : 0
		},
		dataType : 'json'
	}).done(
			function(data) {

				var yAxisName = new Array(new Array('日产气(方/天)', '日产液(方/天)'), new Array(
						'平均日产气(方/天)', '井底流压(MPA)'));

				$('#lineDiv').html("");
				$.each(data,
						function(i, item) {
							$('#lineDiv').append(
									"<div id='" + item.divID
											+ "' class='singleChart' style='height: 200px'></div>");
							FunDrawLine(chartEC, item.echartData, item.divID, theme,
									yAxisName[i]);
						});
			});

}

function FunDrawPie(ec, id, theme, item) {

	// 基于准备好的dom，初始化echarts图表
	var myChart = ec.init(document.getElementById(id), macarons);

	option = {
		title : {
			text : '',
			x : 'center'
		},
		tooltip : {
			// show:false,
			trigger : 'item',
			formatter : "{a} {b} : {c} ({d}%)",
			enterable : true
		},
		legend : {
			orient : 'vertical',
			x : 'left',
			// data : [ '>1000m3/d', '500-1000m3/d', '<500m3/d' ]
			data : ['>100000 m3/d', '50000-100000 m3/d','<50000 m3/d']
		},
		toolbox : {
			show : true,
			feature : {
				restore : {
					show : true
				},
				saveAsImage : {
					show : true
				}
			}
		},
		calculable : true,
		series : [{
			name : '容量',
			type : 'pie',
			radius : '55%',
			center : ['50%', '60%'],
			data : [{
				value : 100,
				name : '>1000m3/d'
			}, {
				value : 67,
				name : '500-1000m3/d'
			}, {
				value : 264,
				name : '<500m3/d'
			}]
		}],
		color:['#ef7a82', '#0eb83a', '#44CEF6']
		
	};

	// 为echarts对象加载数据
	option.legend.data = item.data;
	option.series[0] = item.series;
	myChart.setOption(option);
}

function FunDrawBar(ec, id, theme, item) {

	// 基于准备好的dom，初始化echarts图表
	var myChart = ec.init(document.getElementById(id), macarons);

	option = {
		title : {
			text : '',
		},
		tooltip : {
			trigger : 'axis'
		},
		legend : {
			data : ['投产井', '目前生产井', '产气井', '关停井']
		},
		toolbox : {
			orient : 'vertical',
			show : true,
			feature : {
				/*
				 * mark : { show : true }, dataView : { show : true, readOnly : false },
				 */
				magicType : {
					show : true,
					type : ['line', 'bar']
				},
				restore : {
					show : true
				},
				saveAsImage : {
					show : true
				}
			}
		},
		calculable : false,
		xAxis : [{
			axisLabel : {
				show : true,
				textStyle : {
					fontSize:5,
					fontWeight:'bold'
				}
			},
			data : ['延1井组', '外围井', '延5井组', '延3井组', '谭平产建新井', '万宝山产建新井', '合计']
		}],
		yAxis : [{
			type : 'value'
		}],
		series : [{
			name : '投产井',
			type : 'bar',
			data : [31, 42, 31, 40, 146, 635, 925],
		/*
		 * markPoint : { data : [ {type : 'max', name: '最大值'}, {type : 'min', name:
		 * '最小值'} ] }, markLine : { data : [ {type : 'average', name: '平均值'} ] }
		 */
		}, {
			name : '目前生产井',
			type : 'bar',
			data : [31, 25, 31, 40, 146, 635, 908],
		}, {
			name : '产气井',
			type : 'bar',
			data : [20, 16, 28, 33, 3, 260, 360],
		}, {
			name : '关停井',
			type : 'bar',
			data : [0, 17, 0, 0, 0, 0, 17],
		}]
	};

	// 为echarts对象加载数据
	option.legend = item.legend;
	option.xAxis[0].data = item.xAxis.data;
	option.series = item.series;

	myChart.setOption(option);
}

function FunDrawLine(ec, item, id, theme, yAxisName) {

	// 基于准备好的dom，初始化echarts图表
	var myChart = ec.init(document.getElementById(id), macarons);

	option = {
		title : {
			text : item.showName,
			x : 'center',
		},
		tooltip : {
			trigger : 'axis'
		},
		legend : {// 图例
			show : true,
			data : yAxisName,
			x:170,
			orient:'vertical',
		},
		grid : {
			x : '10%',
			y : '15%',
			x2 : '10%',
			y2 : '15%'
		},
		toolbox : {
			orient : 'vertical',
			show : true,
			x : 'right',
			y : 30,
			feature : {
				/*
				 * dataView : { show : true, readOnly : false }, magicType : { show :
				 * true, type : strs[1] }, restore : { show : true }, mark : { show :
				 * true },
				 */
				dataZoom : {
					show : true
				},
				/*
				 * magicType : { show : true, type : strs[1] },
				 */
				restore : {
					show : true
				},
				saveAsImage : {
					show : true
				}
			}
		},
		calculable : false,// 是否启用拖拽
		xAxis : [{
			type : 'category',
			boundaryGap : false,
			data : item.xAxis
		}],
		yAxis : [{
			name : yAxisName[0],
			type : 'value'
		}, {
			name : yAxisName[1],
			type : 'value'
		}],
		series : item.series,
		color:['#ef7a82','#44CEF6']
	};

	// 为echarts对象加载数据
	if(id == 'doulbeLine2'){
		option.color = ['#ef7a82','#ffa400'];
	}
	myChart.setOption(option);
}

function showSpinner(id){
	$(id).html("");
	$(id).append("<div class='spinner'>" +
			"<div class='rect1'></div><div class='rect2'></div>" +
			"<div class='rect3'></div><div class='rect4'></div>" +
			"<div class='rect5'></div></div>"
			);
}